import React, {Component} from 'react';
import Loading from "./components/Lading"
class App extends Component {
    state = {
        items:[],
        isLoading:true,// 是否正在加载中
        isError:false
    }
    render() {
        if(this.state.isError){
            return (
                <h3>网络连接错误，请稍后再尝试!</h3>
            )
        }
        return (
            <div>
                {this.state.isLoading?<Loading/>:(
                    <div>
                        {
                            this.state.items.map(item=>(
                                <p key={item.id}>
                                    <a href={item.html_url}>{item.full_name}</a>
                                </p>
                            ))
                        }
                    </div>
                )}
            </div>
        )
    }
    async searchRepositories(){
        try{
            const {data: { items }} = await this.$http.get("/search/repositories",{
                params:{
                    q:"react",
                    sort:"stars"
                }
            })
            this.setState({
                items,
                isLoading:false
            })
        }catch (err){
            // console.log(1111,err);
            this.setState({
                isError:true
            })
        }

    }

    componentDidMount() {
        this.searchRepositories();
    }
}

export default App;